<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
		<meta name="format-detection" content="telephone=no">
		<link href="img/favicon.ico" type="image/x-icon" rel="shortcut icon" />
		<title>保单整理</title>
		<link rel="stylesheet" href="css/default.min.css" />
		<link rel="stylesheet" href="frozen/css/frozen.css" />
		<style>
			.ui-form .ui-form-item label:not(.ui-switch):not(.ui-checkbox):not(.ui-radio) {
				text-align: right;
				padding-right: 1.5rem;
			}
			
			.ui-icon-close {
				display: none;
			}
			
			input[type="text"]:focus ~ .ui-icon-close {
				display: inherit;
			}
			
			.data-list-dialog .ui-dialog-bd,
			.beneficiary-dialog .ui-dialog-bd {
				padding: 0;
				/*font-family: "黑体";*/
				font-size: 2rem;
			}
			
			.data-list-dialog .ui-dialog-cnt,
			.beneficiary-dialog .ui-dialog-cnt {
				background-color: rgba(252, 252, 252, 1);
			}
			
			.data-list-dialog .ui-dialog-bd h4,
			.beneficiary-dialog .ui-dialog-bd h4 {
				text-align: center;
				line-height: 36px;
				color: rgba(155, 155, 155, 1);
			}
			
			.data-list-dialog .ui-dialog-bd li {
				line-height: 36px;
				text-align: center;
				border-top: 1px solid rgba(239, 239, 239, 1);
			}
			
			.data-list-dialog .ui-dialog-bd li.sel {
				background-color: rgba(145, 200, 241, 1);
			}
			
			.ui-dialog-bd ul {
				max-height: 300px;
				overflow: hidden;
				overflow-y: auto;
			}
			
			.ui-dialog-bd ul li.active {
				background-color: rgba(0, 184, 234, 1);
				color: rgba(255, 255, 255, 1);
			}
			.beneficiary-dialog{				
				text-align: center;
			}
			.beneficiary-dialog .ui-dialog-cnt{
				margin: auto;
			}
			.beneficiary-dialog li {
				display: inline-block;
				white-space: nowrap;
				padding-left: 5%;
				border-top: 1px solid rgba(239, 239, 239, 1);
				line-height: 36px;
			}
			
			.beneficiary-dialog li input {
				width: 30%;
				margin-right: 5%;
				border: 1px solid rgba(151, 151, 151, .6);
				line-height: 20px;
				text-indent: .5em;
				border-radius: 3px;
			}
			
			.beneficiary-dialog li input[type=number] {
				margin-right: 1%;
			}
			
			.beneficiary-dialog li em {
				color: rgba(0, 0, 0, 1);
				font-size: 1.2rem;
			}
			
			.beneficiary-dialog li label {
				color: rgba(70, 132, 207, 1);
				text-align: center;
				width: 25%;
				display: inline-block;
			}
			
			.beneficiary-dialog .li-btn {
				width: 95%;
				text-align: center;
			}
			
			.beneficiary-dialog .li-btn label {
				margin: auto;
				width: 90%;
				border: 1px solid rgba(151, 151, 151, .6);
				line-height: 28px;
				color: inherit;
				border-radius: 3px;
				margin-left: -5%;
			}
		</style>
	</head>

	<body>
		<div class="ui-form ui-border-t">
			<form id="formPolicy">
				<div class="ui-form-item ui-border-b">
					<label>
						被保险人
					</label>
					<input type="text" id="iperson" name="iperson" class="data-list" inter="iperson" placeholder="本人" title="被保险人">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						年龄
					</label>
					<input type="number" id="age" name="age" class="data-list" inter="age" placeholder="40" title="选择年龄">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						保险公司
					</label>
					<input type="text" id="company" name="company" class="data-list" inter="dicompany" placeholder="中国人寿" title="保险公司">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						保险名称
					</label>
					<input type="text" id="name" name="name" placeholder="意外保险C档产品">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						保险类型
					</label>
					<input type="text" id="itype" name="itype" class="data-list" inter="ditype" placeholder="意外" title="保险类型">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						保险额度
					</label>
					<input type="number" id="iamount" name="iamount" placeholder="100,000">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						保险费用
					</label>
					<input type="number" id="cost" name="cost" placeholder="20,000">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						缴纳期限
					</label>
					<input type="text" id="paymentterm" name="paymentterm" placeholder="缴纳期限说明">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						保险分红
					</label>
					<input type="text" id="isdividends" name="isdividends" inter="isdividends" class="data-list" title="是否有分红" placeholder="有">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-border-b">
					<label>
						受益人
					</label>
					<input type="text" id="beneficiary" name="beneficiary" class="data-list" inter="beneficiary" placeholder="妻子(80%) 儿子(20%)">
					<a href="#" class="ui-icon-close">
					</a>
				</div>
				<div class="ui-form-item ui-form-item-textarea ui-border-b">
					<label>
						利益说明
					</label>
					<textarea id="idescription" name="idescription" placeholder="利益说明"></textarea>
				</div>
				<input type="hidden" id="userid" name="userid" />
				<input type="hidden" id="id" name="id" />
			</form>
			<div class="ui-btn-wrap">
				<label id="btnSave" class="ui-btn-lg">
					保存
				</label>
			</div>
		</div>
		<div class="ui-dialog beneficiary-dialog">
			<div class="ui-dialog-cnt">
				<div class="ui-dialog-bd">
					<div>
						<h4>受益人</h4>
						<div class="content">
							<ul></ul>
						</div>
					</div>
				</div>
				<div class="ui-dialog-ft ui-btn-group">
					<button type="button" data-role="button" class="select" id="dialogButton">保存</button>
				</div>
			</div>
		</div>
	</body>
	<script src="js/jquery.min.js"></script>
	<!--<script src="frozen/js/frozen.js"></script>-->
	<script src="js/layer/layer.js"></script>
	<script src="frozen/js/dialog.js"></script>
	<script src="js/APPDataInterface.js"></script>
	<script src="js/common.js"></script>
	<script src="js/editpolicy.js"></script>

</html>